<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  
  
  
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title>
    
    无敌小笼包</title>
  
    <link rel="shortcut icon" href="/favicon.png">
  
  <link rel="stylesheet" href="/css/style.css">
  
    <link rel="stylesheet" href="/fancybox/jquery.fancybox.min.css">
  
  <script src="/js/pace.min.js"></script>
</head>

<body>
<main class="content">
  <section class="jumbotron">
  <div class="video">
    
      <div class="video-frame">
        <img src="/images/ocean/overlay-hero.png" alt="Decorative image frame">
      </div>
    
    <div class="video-media">
      <div style="
          display: block;
          width: 100%;
          max-width: 100%;
          height: 100%;
          background-image: url('https://i.qh13.cn/t/1548385428640.png');
          background-position: center center;
          background-repeat: no-repeat;
          background-size: cover;background-attachment: fixed;
          background-color: #464646;"
      >
      </div>
       <!-- <div class="video-overlay"></div> -->
    </div>
    <div class="video-inner text-center text-white">
      <h1><a id="jinrishici-sentence" href="/">无敌小笼包</a></h1>
        <p class="rand-words">不要以貌取人，外貌并不重要，重要的是人品与气质</p>
      <div><img src="/images/hexo-inverted.svg" class="brand" alt="无敌小笼包"></div>
    </div>
    <div class="video-learn-more">
      <a class="anchor" href="#landingpage"><i class="fe fe-mouse"></i></a>
    </div>
  </div>
</section>

<div id="landingpage">
  <section class="outer">
  <article class="articles">
    
    <h1 class="page-type-title"></h1>

    
      
        <article id="post-OOCSS" class="article article-type-post" itemscope itemprop="blogPost">

  <div class="article-inner">
    
      <header class="article-header">
        
  
    <h2 itemprop="name">
      <a class="article-title" href="/2016/02/27/OOCSS/">面向对象的CSS样式</a>
    </h2>
  

      </header>
    

    
      <div class="article-meta">
        <a href="/2016/02/27/OOCSS/" class="article-date">
  <time datetime="2016-02-27T06:11:20.000Z" itemprop="datePublished">2016-02-27</time>
</a>
        
  <div class="article-category">
    <a class="article-category-link" href="/categories/HTML/">HTML</a>
  </div>

      </div>
    

    <div class="article-entry" itemprop="articleBody">
      
      
      
        <p>　　<strong> OOCSS:</strong>面向对象的CSS样式，通过对CSS样式的合理规范，重复使用，达到代码的精简，便于换肤。<br>
        
          <a class="article-more-link" href="/2016/02/27/OOCSS/">阅读全文...</a>
        
      
    </div>
    <footer class="article-footer">
      <a data-url="http://blog.mango16.cc/2016/02/27/OOCSS/" data-id="cjrbtw1xi00056d8h7mtaac84"
         class="article-share-link">分享</a>
      
  <ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/CSS/">CSS</a></li></ul>

    </footer>

  </div>

  

  

</article>



      
        <article id="post-Ajax" class="article article-type-post" itemscope itemprop="blogPost">

  <div class="article-inner">
    
      <header class="article-header">
        
  
    <h2 itemprop="name">
      <a class="article-title" href="/2016/01/27/Ajax/">Ajax学习计划</a>
    </h2>
  

      </header>
    

    
      <div class="article-meta">
        <a href="/2016/01/27/Ajax/" class="article-date">
  <time datetime="2016-01-27T06:11:20.000Z" itemprop="datePublished">2016-01-27</time>
</a>
        
  <div class="article-category">
    <a class="article-category-link" href="/categories/js/">js</a>
  </div>

      </div>
    

    <div class="article-entry" itemprop="articleBody">
      
      
      
        <p>　　<strong>AJAX：</strong>Asynchronous Javascript And XML（异步JavaScript和XML）。是指一种创建交互式网页应用的网页开发技术。 AJAX = 异步 JavaScript和XML（标准通用标记语言的子集）。 AJAX 是一种用于创建快速动态网页的技术。 通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。 传统的网页（不使用 AJAX）如果需要更新内容，必须重载整个网页页面。</p>
        
          <a class="article-more-link" href="/2016/01/27/Ajax/">阅读全文...</a>
        
      
    </div>
    <footer class="article-footer">
      <a data-url="http://blog.mango16.cc/2016/01/27/Ajax/" data-id="cjrbtw1xx000p6d8h1c9buh92"
         class="article-share-link">分享</a>
      
  <ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/js/">js</a></li></ul>

    </footer>

  </div>

  

  

</article>



      
        <article id="post-AjaxStatus" class="article article-type-post" itemscope itemprop="blogPost">

  <div class="article-inner">
    
      <header class="article-header">
        
  
    <h2 itemprop="name">
      <a class="article-title" href="/2016/01/19/AjaxStatus/">Ajax Status请求状态</a>
    </h2>
  

      </header>
    

    
      <div class="article-meta">
        <a href="/2016/01/19/AjaxStatus/" class="article-date">
  <time datetime="2016-01-19T05:58:41.000Z" itemprop="datePublished">2016-01-19</time>
</a>
        
  <div class="article-category">
    <a class="article-category-link" href="/categories/js/">js</a>
  </div>

      </div>
    

    <div class="article-entry" itemprop="articleBody">
      
      
      
        <p>　　这篇文章主要介绍了各类Http请求状态(status)及其含义。<br>　　需要的朋友可以过来参考下，希望对大家有所帮助。Web服务器响应浏览器或其他客户程序的请求时，其应答一般由以下几个部分组成：一个状态行，几个应答头，一个空行，内容文档。下面是一个最简单的应答   ：<br>状态行包含HTTP版本、状态代码、与状态代码对应的简短说明信息。<br>
        
          <a class="article-more-link" href="/2016/01/19/AjaxStatus/">阅读全文...</a>
        
      
    </div>
    <footer class="article-footer">
      <a data-url="http://blog.mango16.cc/2016/01/19/AjaxStatus/" data-id="cjrbtw1x500006d8hf3yus8oc"
         class="article-share-link">分享</a>
      
  <ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/js/">js</a></li></ul>

    </footer>

  </div>

  

  

</article>



      
        <article id="post-JSTip" class="article article-type-post" itemscope itemprop="blogPost">

  <div class="article-inner">
    
      <header class="article-header">
        
  
    <h2 itemprop="name">
      <a class="article-title" href="/2016/01/19/JSTip/">原生JS TitleTip</a>
    </h2>
  

      </header>
    

    
      <div class="article-meta">
        <a href="/2016/01/19/JSTip/" class="article-date">
  <time datetime="2016-01-19T05:58:41.000Z" itemprop="datePublished">2016-01-19</time>
</a>
        
  <div class="article-category">
    <a class="article-category-link" href="/categories/HTML/">HTML</a>
  </div>

      </div>
    

    <div class="article-entry" itemprop="articleBody">
      
      
      
        <p>　　<strong> 自用笔记：</strong>本文属于自用笔记，不做详解，仅供参考。在此记录自己已理解并开始遵循的前端代码规范。What How Why<br>
        
          <a class="article-more-link" href="/2016/01/19/JSTip/">阅读全文...</a>
        
      
    </div>
    <footer class="article-footer">
      <a data-url="http://blog.mango16.cc/2016/01/19/JSTip/" data-id="cjrbtw1xk00066d8h1ygwq6xu"
         class="article-share-link">分享</a>
      
  <ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/JavaScript/">JavaScript</a></li></ul>

    </footer>

  </div>

  

  

</article>



      
        <article id="post-Sublimebest" class="article article-type-post" itemscope itemprop="blogPost">

  <div class="article-inner">
    
      <header class="article-header">
        
  
    <h2 itemprop="name">
      <a class="article-title" href="/2015/12/21/Sublimebest/">Sublime Text历练</a>
    </h2>
  

      </header>
    

    
      <div class="article-meta">
        <a href="/2015/12/21/Sublimebest/" class="article-date">
  <time datetime="2015-12-21T10:29:20.000Z" itemprop="datePublished">2015-12-21</time>
</a>
        
  <div class="article-category">
    <a class="article-category-link" href="/categories/Tool/">Tool</a>
  </div>

      </div>
    

    <div class="article-entry" itemprop="articleBody">
      
      
      
        <hr>
<p>　　<strong>自用笔记：</strong>本文属于自用笔记，不做详解，仅供参考。在此记录自己已理解并开始遵循的前端代码规范。What How Why<br>
        
          <a class="article-more-link" href="/2015/12/21/Sublimebest/">阅读全文...</a>
        
      
    </div>
    <footer class="article-footer">
      <a data-url="http://blog.mango16.cc/2015/12/21/Sublimebest/" data-id="cjrbtw1yv001z6d8hw168jjp7"
         class="article-share-link">分享</a>
      
  <ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/Sublime/">Sublime</a></li></ul>

    </footer>

  </div>

  

  

</article>



      
        <article id="post-SublimePackage" class="article article-type-post" itemscope itemprop="blogPost">

  <div class="article-inner">
    
      <header class="article-header">
        
  
    <h2 itemprop="name">
      <a class="article-title" href="/2015/12/21/SublimePackage/">Sublime插件</a>
    </h2>
  

      </header>
    

    
      <div class="article-meta">
        <a href="/2015/12/21/SublimePackage/" class="article-date">
  <time datetime="2015-12-21T10:29:10.000Z" itemprop="datePublished">2015-12-21</time>
</a>
        
  <div class="article-category">
    <a class="article-category-link" href="/categories/Tool/">Tool</a>
  </div>

      </div>
    

    <div class="article-entry" itemprop="articleBody">
      
      
      
        <hr>
<p>　　<strong>自用笔记：</strong>本文属于自用笔记，不做详解，仅供参考。在此记录自己已理解并开始遵循的前端代码规范。What How Why<br>
        
          <a class="article-more-link" href="/2015/12/21/SublimePackage/">阅读全文...</a>
        
      
    </div>
    <footer class="article-footer">
      <a data-url="http://blog.mango16.cc/2015/12/21/SublimePackage/" data-id="cjrbtw1xs000g6d8hdadhsqvz"
         class="article-share-link">分享</a>
      
  <ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/Sublime/">Sublime</a></li></ul>

    </footer>

  </div>

  

  

</article>



      
  </article>
  
  
    <nav class="page-nav">
      
      <a class="extend prev" rel="prev" href="/page/2/">前一篇</a><a class="page-number" href="/">1</a><a class="page-number" href="/page/2/">2</a><span class="page-number current">3</span>
    </nav>
  
</section>
</div>
<script src="//s4.ssl.qhres.com/static/ed286845be179ccf.js" charset="utf-8"></script>

  <footer class="footer">
  
  <div class="outer">
    <ul class="list-inline">
      <li>&copy; 2019 无敌小笼包</li>
      <i class="pulse"></i>
    </ul>
  </div>
</footer>

</main>
<aside class="sidebar">
  <button class="navbar-toggle"></button>

<nav class="navbar">
  
    <div class="logo">
      <a href="/"><img src="/images/hexo.svg" alt="无敌小笼包"></a>
    </div>
  
  <ul class="nav nav-main">
    
      <li class="nav-item">
        <a class="nav-item-link" href="/">主页</a>
      </li>
    
      <li class="nav-item">
        <a class="nav-item-link" href="/archives">归档</a>
      </li>
    
      <li class="nav-item">
        <a class="nav-item-link" href="/gallery">相册</a>
      </li>
    
      <li class="nav-item">
        <a class="nav-item-link" href="/nagging">叽咕</a>
      </li>
    
      <li class="nav-item">
        <a class="nav-item-link" href="/about">关于</a>
      </li>
    
    <li class="nav-item">
      <a class="nav-item-link nav-item-search" title="Search">
        <i class="fe fe-search"></i>
        搜索
      </a>
    </li>
  </ul>
</nav>

<nav class="navbar navbar-bottom">
  <ul class="nav">
    <li class="nav-item">
      
        <a class="nav-item-link" target="_blank" href="/atom.xml" title="RSS Feed">
          <i class="fe fe-feed"></i>
        </a>
      
    </li>
  </ul>
</nav>

<div class="search-form-wrap">
  <div class="local-search local-search-plugin">
  <input type="search" id="local-search-input" class="local-search-input" placeholder="Search...">
  <div id="local-search-result" class="local-search-result"></div>
</div>
</div>
</aside>
  <script src="/js/jquery-2.0.3.min.js"></script>
<script src="/js/lazyload.min.js"></script>


  <script src="/fancybox/jquery.fancybox.min.js"></script>



  <script src="/js/search.js"></script>


<script src="/js/ocean.js"></script>

</body>
</html>